<template>
	<view class="video_player">
		<!-- 视频播放器 -->
		<video class="video_box" :src="urls[0] ? urls[0].url : mvData.url"></video>
		<Commend v-if="videoId != '' && videoType != ''" :videoId="videoId" :videoType="videoType"> 
			<!-- #ifndef APP-PLUS  -->
			<Share
			 :videoId="videoId"
			 :videoType="videoType"
			/>
			<!-- #endif -->
			<!-- #ifdef APP-PLUS -->
			<Share
			 :videoId="videoId"
			 :videoType="videoType"
			 :videoUrl="urls[0] ? urls[0].url : mvData.url"
			/>
			<!-- #endif -->
		</Commend>
	</view>
</template>

<script>
	import { getVideoUrl, getMvUrl } from '../../api/index.js'
	import Share from '../../components/Share/Share.vue'
	import Commend from '../../components/Commend/Commend.vue'
	export default {
		data() {
			return {
				// 存储视频url地址
				urls: [],
				// 存储mvurl地址
				mvData: [],
				// 视频id
				videoId: '',
				// 视频类型
				videoType: ''
			}
		},
		components: { Share, Commend },
		onLoad({id, type}) {
			// 视频id, 视频类型
			this.videoId = id
			this.videoType = type
			// 1. 得到视频id及type[用于判断是视频还是mv]
			// 2. 发请求获取视频的 url
			this.getVideoDatas(id, type)
		},
		// #ifdef MP-WEIXIN
		/* 哪个页面要分享这两个事件就必须写在哪个页面 */
		// 分享到朋友圈
		onShareTimeline() {
			return {
				title: 'wy_music',
				imageUrl: '../../static/logo.png'
			}
		},
		// 分享事件
		onShareAppMessage() {
			// return eventHandler接收到的分享参数
			return {
				title: 'wy_music', // 分享名称
				path: '/pages/VideoPlayer/VideoPlayer' // 默认是当前页面的路径地址
				// imageUrl 默认是页面截图
			}
		},
		// #endif
		methods: {
			async getVideoDatas(id, type) {
				if (type == 1) {
					const {data: {urls}} = await getVideoUrl({id})
					this.urls = urls
				} else {
					const {data: {data: res}} = await getMvUrl({id})
					this.mvData = res
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.video_player {
		width: 750rpx;
		.video_box {
			width: 100%;
			height: 40vh;
			margin-bottom: 40rpx;
		}
	}
</style>
